import {useEffect, useState} from 'react'
import {SendInputItem} from '@/packageA/components/SendInput/SendInput'
import {inputIcons as icons} from '@/assets/constant/input'
import {SightInfoDetail} from '@/packageA/hooks/senne'
import {selectCollect, selectDidCollect, selectDidSight, selectSight} from '@/packageA/api/scene'

/**
 * icon
 */
export const useInputHooks = (onShowComment: () => void, sightInfoDetail: Partial<SightInfoDetail>) => {
  const [inputIcons, setInputIcons] = useState<SendInputItem[]>(icons)

  useEffect(() => {
    if (!sightInfoDetail.id) return
    let icon = icons.slice()
    let arr = [{
      num: sightInfoDetail.likeNum,
      status: sightInfoDetail.isLike
    }, {
     num: sightInfoDetail.collectNum,
     status:  sightInfoDetail.isCollect
    }, {
      num: sightInfoDetail.commentNum,
      status: false
    }]
    for (let i = 0; i < arr.length; i++) {
      icon[i].num = arr[i].num as number
      icon[i].status = arr[i].status as boolean
    }
    setInputIcons(icon)
  }, [sightInfoDetail])

  function onclick (item: SendInputItem, index: number) {
    if (!item.status && !item.activeIcon) {
      onShowComment()
      return
    }

    inputIcons[index].num += item.status ? -1 : 1
    inputIcons[index].status = !item.status

    setInputIcons([...inputIcons])

    if (index === 0) {
      if (inputIcons[index].status) {
        selectSight(sightInfoDetail.id as string)
      } else {
        selectDidSight(sightInfoDetail.id as string)
      }
    } else if (index === 1){
      if (inputIcons[index].status) {
        selectCollect(sightInfoDetail.id as string)
      } else {
        selectDidCollect(sightInfoDetail.id as string)
      }
    }
  }

  return {
    inputIcons,
    onclick
  }
}
